<template>
  <PageContainer>
    <view class="container">
      <Tabs v-model="parame.approvalStatus" :data="dataList" @change="tabsChange">
        <Header title="我的活动" :is-box-shadow="false">
          <view style="padding: 16rpx 32rpx; height: 72rpx">
            <TSearch placeholder="请输入搜索内容" @confirm="searchFnc" />
          </view>

          <TabNav tabBarColor="#2878FF" />
        </Header>
        <template>
          <TabsItem name="全部" :value="void 0"></TabsItem>
          <TabsItem name="待参加" :value="ApprovalStatusEnum.WAITPARTICIPATEIN"></TabsItem>
          <TabsItem name="审核中" :value="ApprovalStatusEnum.UNDERREVIEW"></TabsItem>
          <TabsItem name="被驳回" :value="ApprovalStatusEnum.REJECT"></TabsItem>
          <TabsItem name="已取消" :value="ApprovalStatusEnum.CANCEL"></TabsItem>
        </template>
      </Tabs>
      <Paglist
        v-model="dataList"
        :is-init-api="true"
        :parame="parame"
        @register="register"
        :scroll-top-bottom="260"
        :is-show-loadmore="dataList.length >= 1"
      >
        <template v-for="(v, i) in dataList" :key="i">
          <view class="activity-item">
            <MyActivityListItem :item="v" @refresh="refresh" />
          </view>
        </template>
      </Paglist>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* myActivity 我的活动 */
  import { onPageScroll, onShareAppMessage } from '@dcloudio/uni-app';
  import PageContainer from '@/components/PageContainer/index.vue';
  import type { IActivityListData, IActivityListResData } from '@/api/activity/types';
  import { navigateTo } from '@/router';
  import { reactive, ref, provide, watch } from 'vue';
  import Header from '@/components/Header/index.vue';
  import Tabs from '@/components/tabs/index.vue';
  import TabsItem from '@/components/tabs/item.vue';
  import TabNav from '@/components/tabs/nav.vue';
  import Paglist from '@/components/Paglist/index.vue';
  import { useConList } from '@/components/Paglist/useConList';
  import { myActivityPageList } from '@/api/activity';
  import MyActivityListItem from './components/MyActivityListItem.vue';
  import { ApprovalStatusEnum } from '@/enums/activityStatusEnum';
  import TSearch from '@/components/TSearch/index.vue';
  import { useAppStoreWithOut } from '@/store/modules/app';
  import { ShareTypeEnum } from '@/enums/shareEnum';
  import { useAppShare } from '@/hooks/core/useAppShare';

  const { setWxSharePath } = useAppShare();

  provide('api', async (obj: any) => {
    !obj.approvalStatus && (obj.approvalStatus = void 0);
    const res = await myActivityPageList(obj);
    return res;
  });

  const dataList = ref<IActivityListResData[]>([]);

  const parame = reactive<IActivityListData>({
    approvalStatus: void 0,
    title: '',
    myActivity: 1,
    activityStatuss: [],
    publishStatus: void 0,
    current: 1,
    size: 10,
  });
  const [register, { refresh }] = useConList();

  function tabsChange() {
    refresh && refresh();
  }

  function searchFnc(keyword: string) {
    parame.title = keyword;
    refresh && refresh();
  }

  const handleArrange = (item: IActivityListResData) => {
    navigateTo({
      name: 'activityScheduling',
      options: {
        activityId: item.id,
        activityRegisterId: item.register?.id!,
      },
    });
  };

  const { hasShareImgConfig } = useAppStoreWithOut();
  /** 分享 */
  onShareAppMessage((e) => {
    const myActivity = hasShareImgConfig(ShareTypeEnum.myActivity);
    return {
      title: myActivity?.desc,
      path: setWxSharePath({ name: 'myActivity' }),
      imageUrl: myActivity?.iconUrl,
    };
  });

  onPageScroll(() => {});
</script>

<style lang="scss" scoped>
  .container {
    .activity-item {
      padding: 0 30rpx;
      margin-bottom: 30rpx;
      &:nth-child(1) {
        padding-top: 30rpx;
      }
    }
  }
</style>
